<%@page import="mks.webshop.entity.PanelType"%>
<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/jsp/include.jsp"%>
<!--[if IE]>
	<link rel="stylesheet" type="text/css" href="css/ie_style.css"></link>
<![endif]-->


  <div>
		<%
			String username = (String)session.getAttribute("username");
			Long counter = (Long)session.getAttribute("counter");
		%>
		
	    <form id="login-form-id" class="form-3" style="background:#467224;">
	    
	     <c:if test="${empty username}">
				<p class="clearfix">
					<label for="login">Tên</label> <input name="username" id="username" placeholder="Tên" type="text">
				</p>
				<p class="clearfix">
					<label for="password">Mật khẩu</label> <input name="password" id="password" placeholder="Mật khẩu" type="password">
				</p>
				<p class="clearfix" style="background:#193812; margin-top:10px; display:inline;">
					<input id="register" name="submit" value="Đăng ký" type="button">
				</p>
				<p class="clearfix" style="background:#193812; margin-top:10px; display:inline;">
					<input id="login" name="submit" value="Đăng nhập" type="button">
				</p>
		</c:if>
		 <c:if test="${username != null}">
		 	<div style="margin:20px 10px 10px 40px;">
			 	<c:out value="Chào mừng: ${username}"></c:out>
			 	<a id="logout" href="/logoutuser.html">Thoát</a></br>
			 	<a href="/detailuser.html?id=${username}">Thông tin người dùng</a>
			 </div>
		 </c:if>
		</form>
	
</div>
                
<div id="right-order-block-id" class="block block-views" style="margin-top:5px; position:fixed; top: 250px;">


		<div class="Thongbao"><a href="#" style="color:#ffffff;">HÓA ĐƠN CỦA BẠN</a></div>
  <div class="content">
     <div class="view view-uc-products-trial view-id-uc_products_trial view-display-id-block_1 view-dom-id-4">
      <div class="view-content">
		      <table class="views-view-grid" style="font-size: 12px; border: 3px solid #ff9726;">
		      	<tbody>
					<c:forEach var="detail" items="${booking}">
		                <tr class="row-1 row-first" style="">
		                	<td class="minicart1" style="width:40%; ">
		              			<strong><p style="margin-left:2px; color: #327224;">${detail.productName}</p></strong>
		  					</td>
		  					<td class="minicart2" style="width:20%;">
		  						<p style="color: #327224;">${detail.unit}</p>
		  					</td>
		  					<td class="minicart3" style="width:40%">
		  						<a href="/moveproductbookinghome.html?id=${detail.productCode}" style="float: right; font-size: 10px; background-color:#ffffff; margin-right:5px;">
			  						x
		  					</a>
		  					</td>
		  				</tr>
		  				<tr class="row-1 row-first" style="width:60%; border-bottom:1px solid #ff9726;">
		                	<td class="minicart1">
		              			<p></p>
		  					</td>
		  					<td class="minicart2" style="width:20%;">
		  						<p style = "color: #327224;">x ${detail.quantity}</p>
		  					</td>
		  					<td class="minicart3" style="width:20%;">
		  						<p style="color: #327224;display:inline;"> = </p>
		  						<p name="uc_price_name" style="color: #327224;display:inline;">${detail.price}</p>
		  					</td>
		  				</tr>
		  				
		          </c:forEach>
		          </tbody>
		          </table>
		           
		          <div style="margin-top:50px;">
      <p style="font:15px bold Georgia,serif; color:#858585;display:inline; margin-left:10px;">PHÍ GIAO HÀNG</p>
 		<p style="font:15px bold Georgia,serif; color:#858585; display:inline; margin-left:30px;">10,000</p>
     </div>
     </div>

</div>     </div>
	<div class="Thongbao" style="height:100px; margin-top:20px;">
		<a href="" style="color:#ffffff; margin-left:-50px;">TỔNG TIỀN</a>
		<p name="uc_price_name" style="margin-top:5px;">${order.totalPrice}</p>
		<a id="shopping-card-id" href="/shoppingcard.html">
		<button id="booking"style="background:#af0102; width: 100x; border: none; margin-top:15px;">
				<p style="font:15px bold Georgia,serif; color:#c96d15; margin:auto">
					ĐỒNG Ý MUA HÀNG
				</p>
		</button>
		</a>	
	</div>
	<script type="text/javascript">
	$('#right-order-block-id').live("DOMSubtreeModified", function() { 
		var priceElements = document.getElementsByName("uc_price_name");
		
		for(var i = 0; i < priceElements.length; i++){//
			var price = priceElements[i].innerHTML; 
			
			if(IsNumeric(price)){
				var formatPrice = formatDollar(parseInt(price));
				priceElements[i].innerHTML = formatPrice;
			}
			
		}
		function formatDollar(num) {
		    var p = num.toFixed(2).split(".");
		    return p[0].split("").reverse().reduce(function(acc, num, i, orig) {
		        return  num + (i && !(i % 3) ? "," : "") + acc;
		    }, "");
		}
		function IsNumeric(input){
		    var RE = /^-{0,1}\d*\.{0,1}\d+$/;
		    return (RE.test(input));
		}
	});
	
</script>
	
</div>

 
              